/*

TODO:  move api call into server-side code
TODO:  order/sort/organize bands per vehicle (or driver?)
TODO:  remove "UTC" from bubble dates

*/
var AKST = -9;
var mission_timeline;
var resize_timer_id = null;
var theme = Timeline.ClassicTheme.create();
var today = new Date();
today = (today.getMonth()+1) + "/" + today.getDate() + "/" + today.getFullYear();

var tomrw = new Date();
tomrw.setDate(tomrw.getDate() + 1);
tomrw = (tomrw.getMonth()+1) + "/" + tomrw.getDate() + "/" + tomrw.getFullYear();

// background color of the top timeline
// theme.ether.backgroundColors[0] = "orange";

// background color of the middle timeline
// theme.ether.backgroundColors[1] = "yellow";

// background color of the bottom timeline
// theme.ether.backgroundColors[2] = "green";

// height of the events on the top timeline
theme.event.track.height = 1.75;  // em

// space between events on the top timeline
theme.event.track.gap = 0.25;  // em


//
// these next three require 'isDuration':true in the data
//

// left line color for the middle and bottom timelines
theme.event.instant.lineColor = "#1e1f49";

// event color and opacity.
theme.event.instant.impreciseColor = "#5e869a"; 
theme.event.instant.impreciseOpacity = 80;


theme.ether.backgroundColors[1] = theme.ether.backgroundColors[0];


Timeline.MilitaryTimeLabeller = function(locale, timeZone) {
    var labeller = new Timeline.GregorianDateLabeller(locale, timeZone);
    labeller._originalLabelInterval = labeller.labelInterval;
    labeller.labelInterval = Timeline.MilitaryTimeLabeller._replLabelInterval;
    return labeller;
};


Timeline.MilitaryTimeLabeller._replLabelInterval = function(date, intervalUnit) {
    var text;
    var emphasized = false;
    switch(intervalUnit) {
        case Timeline.DateTime.HOUR:
            hour = date.getHours();
	    text = ((hour < 10) ? "0" + hour : hour) + "00";
            emphasized = (text=="0000") || (text=="1200");
            break;
        default:
            return this._originalLabelInterval(date, intervalUnit);
    }
    return {text:text, emphasized:emphasized};
};


loadTimeline = function() {
    var eventSource = new Timeline.DefaultEventSource();
    var bandInfos = [
        Timeline.createBandInfo({
            eventSource:    eventSource,
            date:           today, // "Nov 28 2007 12:00:00",
            width:          "65%", 
            intervalUnit:   Timeline.DateTime.HOUR, 
            intervalPixels: 40,
            theme:          theme,
            timeZone:       AKST
        }),
        Timeline.createBandInfo({
            showEventText:  false,
            trackHeight:    0.5,
            trackGap:       0.2,
            eventSource:    eventSource,
            date:           today, //"Nov 28 2007 12:00:00",
            width:          "25%", 
            intervalUnit:   Timeline.DateTime.DAY, 
            intervalPixels: 150,
            theme:          theme,
            timeZone:       AKST
        }),
        Timeline.createBandInfo({
            showEventText:  false,
            trackHeight:    0.5,
            trackGap:       0.2,
            eventSource:    eventSource,
            date:           today, //"Nov 28 2007 12:00:00",
            width:          "10%", 
            intervalUnit:   Timeline.DateTime.MONTH, 
            intervalPixels: 100,
            theme:          theme,
            timeZone:       AKST
        })
    ];
    bandInfos[0].labeller = Timeline.MilitaryTimeLabeller("en-US", AKST);
    bandInfos[1].decorators = [
        new Timeline.SpanHighlightDecorator({
            startDate:  today, //"Nov 28 2007 00:00:00",
            endDate:    tomrw, //"Nov 29 2007 00:00:00",
            startLabel: "today",
            endLabel:   "",
            color:      "#cce299",
            opacity:    50,
            theme:      theme
        })
    ];

    bandInfos[1].syncWith = 0;
    bandInfos[1].highlight = true;

    bandInfos[2].syncWith = 1;
    bandInfos[2].highlight = true;

    mission_timeline = Timeline.create(
        document.getElementById("mission-timeline"),
        bandInfos);
    Timeline.loadJSON("/api/tmpo/timeline/", 
                      function(json, url) { eventSource.loadJSON(json, url); });

};


function resizeTimeline() {
    if (resize_timer_id === null) {
        resize_timer_id = window.setTimeout(function() {
            resize_timer_id = null;
            mission_timeline.layout();
        }, 500);
    }
}
